//文档加载事件
$(function (){
    // 全选按钮的点击事件
    $('input.selectall').click(function(){
        $('input.singlechk, input.selectall').prop('checked', $(this).prop('checked'));
        // 计算总价
        calcTotal();
        // 计算选中商品的总数量
        calcNum();
    });

    // 单选按钮的点击事件

    // 第一种方法（标签法）：
    // 1. let flag = true;
    // 2. 用$(...).each(function(index, dom){});进行遍历
    // 3. 在循环中判断flag的真假，依此确定全选复选框的取值

    // 第二种方法：
    // 遍历每一个子项目的中复选框，找出选中的复选框的个数，再与复选框的总个数进行比较，如果相等就把全选选中，否则就取消选中。
    $('input.singlechk').click(function(){
        $('input.selectall').prop('checked', $('input.singlechk').length === $('input.singlechk:checked').length);
        let price = parseFloat($(this).parents('.chkbox').siblings('.total').text());
        $('#order .check .total span').text(price.toFixed(2));
        // 计算总价
        calcTotal();
        // 计算选中商品的总数量
        calcNum();
    });

    // 计算总价
    function calcTotal(){
        let total = 0;
        // 如果没有商品了，直接设为0，函数返回
        if ($('table tbody .total').length == 0) {
            $('.check .total>span').text('0.00');
            return;
        }
        $('table tbody .total').each(function(index, dom){
            let flag = $(this).siblings('.chkbox').find('input').prop('checked');
            if(flag) {
                total += parseFloat($(dom).text());
            }
            $('.check .total>span').text(total.toFixed(2));
        });
    }

    // 计算选中商品的总数量
    function calcNum() {
        let num = 0;
        // 如果没有商品了，直接设为0，函数返回
        if ($('#order table tbody .count input').length == 0) {
            $('.check .count>span').text('0');
            return;
        }
        $('#order table tbody .count input').each(function(index, dom){
            let flag = $(this).parents('.count').siblings('.chkbox').find('input').prop('checked');
            if(flag) {
                num += parseInt($(dom).val());
            }
            $('.check .count>span').text(num);
        });
    }

    // 数量增加按钮
    $('.counttable .plus').click(function(){
        // 改变input框中的值
        let index = $(this).siblings('.num').val();
        if (index >= 200) {
            return;
        }

        $(this).siblings('.num').val(++index);
        // 计算单个商品总价
        calcPrice(this, index);
        // 计算总价
        calcTotal();
        // 计算选中商品的总数量
        calcNum();
    });

    // 数量减少按钮
    $('.counttable .minus').click(function(){
        let index = $(this).siblings('.num').val();
        if (index <= 1) {
            return;
        }
        $(this).siblings('.num').val(--index);
        // 计算单个商品总价
        calcPrice(this, index);
        // 计算总价
        calcTotal();
        // 计算选中商品的总数量
        calcNum();
    });

    // 计算单个商品总价
    function calcPrice(obj, index) {
        let singleprice = $(obj).parents('.count').siblings('.price').text();
        let total = singleprice * index;
        $(obj).parents('.count').siblings('.total').text(total.toFixed(2));
    }

    let focusVal = 1;
    // 购物车数量input框的获取焦点事件：用于记录当用户点击input框时的数量
    $('#order table tbody .count input').focus(function(){
        focusVal = parseInt($(this).val());
    });

    // 购物车数量input框的失焦事件
    $('#order table tbody .count input').blur(function(e){
        let str = $(this).val();
        // 判断是否属于1~200之间的正整数
        isRightNum(this, str);
        // 计算单个商品总价
        calcPrice(this, $(this).val());
        // 计算总价
        calcTotal();
        // 计算选中商品的总数量
        calcNum();
    });

    // 判断input的value是否是1~200之间的正整数
    function isRightNum(input, str) {
        var regex = /^[0-9]+\d*$/; // 正则表达式，验证是否是正整数
        if(regex.test(str)){ 
            let num = parseInt(str);
            if (num >= 1 && num <= 200) { // 判断该正整数是否在1~200之间
                console.log(num);
            } else {
                $(input).val(focusVal);
                alert("请输入1~200之间的正整数！");
            }
        } else {
            $(input).val(focusVal);
            alert("请输入1~200之间的正整数！");
        }
    }

    // 给“去结算”按钮绑定点击事件（好像暂时不需要？？？）
    $('.check .checkout').click(function(){
        
    });


    // 给tbody下的tr绑定点击事件，实现删除按钮的功能
    $('#order tbody tr').click(function(e){
        if ($(e.target)[0].className == 'del') {
            $(this).remove();
            // 计算总价
            calcTotal();
            // 计算选中商品的总数量
            calcNum();
        }
    });

    // 给删除选中商品按钮绑定点击事件
    $('.check .del').click(function(){
        $('#order table tbody .chkbox input').each(function(index, dom){
            let flag = $(this).prop('checked');
            if(flag) {
                $(this).parents('tr').remove();
                // 计算总价
                calcTotal();
                // 计算选中商品的总数量
                calcNum();
            }
        });
    });
});